import { ref, onMounted, onUnmounted } from 'vue'
import * as echarts from 'echarts'
import 'echarts-liquidfill'
export function useEcharts(domElement, options) {
  const chart = ref(null)

  onMounted(() => {
    // 初始化ECharts实例
    chart.value = echarts.init(domElement.value)
    // 设置ECharts的配置项
    chart.value.setOption(options.value)
  })

  onUnmounted(() => {
    // 销毁ECharts实例
    if (chart.value) {
      chart.value.dispose()
    }
  })

  // 提供一个更新图表的方法
  function updateChart(newOptions) {
    if (chart.value) {
      chart.value.setOption(newOptions)
    }
  }
  // window.addEventListener('resize', function () {
  //   chart.value.resize()
  // })

  return { chart, updateChart }
}
